jQuery(document).ready(function($) {
//找茬
    //可以允许错误数目
    var p_num=3;
    //总图片数
    var p_pic=3;
    //显示方式 0为水平 1为垂直
    var p_orient=0;

    //游戏参与者

    function User(){}
    User.prototype.set=function(source){
        //游戏进度
        this.gs=source;
        return this;
    }
    //游戏面板
    function Panel(container,source){
        this.container=container;
        this.source=source;
        this._init();
        return this;
    };
    Panel.prototype={
        options:{},
        //创造图片
        _init:function(){
            var header=$('<div class="zt-header"></div>');
            var footer=$('<div class="zt-footer"></div>');
            var pics=$('<div class="zt-pics"></div>');
            this.header=header;
            this.footer=footer;
            this.pics=pics;
            $(this.container).append(header,pics,footer);
        },
        _createPic:function(trap){
            var picdata=this.source[trap];
            var src=picdata.src;
            var ztsdata=picdata.zts;

            //创建原图
            $('<div class="zt-i1" />').append($('<img/>').attr('src',src)).appendTo(this.pics);
            //创建找茬图
            var zts=this._createzts(ztsdata);
            $('<div class="zt-i2" />').append($('<img/>').attr('src',src))
                .append(zts)
                .appendTo(this.pics);
        },
        _createzts:function(ztsdata){
            var html=[];
            var unit='px';
            for(var i=0,len=ztsdata.length;i<len;i++){
                var zt=ztsdata[i];
                var l=zt['l'] + unit;
                var t=zt['t'] + unit;
                var w=zt['w'] + unit;
                var h=zt['h'] + unit;
                var ele='<div class="ui-block" style="left:'+l+';top:'+t+';width:'+w+';height:'+h+'"/>';
                html.push(ele);
            }
            return html.join('');
        },
        //清空画布
        _empty:function(){
            //图部分更新
            this.pics.empty();
        }
    };
    //游戏对象
    function Game(options){
        options=options || {};
        return this._create(options);
    };
    Game.prototype={
        //配置
        options:{},
        //当前游戏局
        trap:0,
        //最大局数
        maxtrap:0,
        //是否开始
        starting:0,
        //构造
        _create:function(options){
            this.options=$.extend({},this.options,options);
            this.maxtrap=this.options.source.length;
            //初始化界面
            this.Panel=new Panel(this.options.container,this.options.source);
            //初始化参与者 
            this.User=(new User()).set(this.options.source);
            return this;
        },
        //开始游戏 
        _start:function(){
            this._msg('游戏开始');
            //绑定事件
            this._ztSourceEvent();
            //开始构建找茬图
            this.Panel._createPic(this.trap);
            this.starting=1;
            return this;
        },
        //绑定找茬数据
        _ztSourceEvent:function(){
            this._msg('绑定事件');
        },
        //测试玩家
        _play:function(s){
            var trap=this.trap;
            var maxtrap=this.maxtrap;
            if(trap<maxtrap){
                s?this._correct():this._error();
                this.trap++;
            }
            else{
                this._msg('比赛结束');
            }
        },
        _msg:function(msg){
            console.log(msg);
        },
        //检测正确与否
        _check:function(){
        },
        //找茬正确
        _correct:function(){
            var user=this.User;
            var trap=this.trap;
            user.gs[trap]['s']=1;
            this._refresh(0);
        },
        //找茬错误
        _error:function(){
            var user=this.User;
            var trap=this.trap;
            user.gs[trap]['s']=0;
            this._refresh(0);
        },
        //跳过
        _next:function(){
            //下一局
            this.trap=this.trap+1;
        },
        //刷新数据 mod==0 更新信息显示
        _refresh:function(mod){
            this._cal();
            this._msg('界面数据被刷新');
        },
        //统计当前用户数目
        _cal:function(){
            var user=this.User;
            var gs=user.gs;
            var valid=0;
            var invalid=0;
            for(var i=0;i<this.maxtrap;i++){
                console.log(gs[i]);
                if(gs[i]['s']===1){
                    valid++;
                }else if(gs[i]['s']===0){
                    invalid++;
                }
            }
            this._msg('成功局数：' + valid + '失败局数：' + invalid);
        },
        //游戏结束
        end:function(){
            this._msg('游戏结束');
        },
        zt:function(action,param){
            var actions=['start','play'];
            if($.inArray(action,actions)!==-1){
                this['_'+action].call(this,param);
            }
        }
    };
    var options={
        container:'#container',
        source:[{
            name:'图1',
            src:'./images/i1.png',
            zts:[{l:0,t:0,w:10,h:10},{l:20,t:20,w:10,h:10},{l:30,t:30,w:10,h:10}],
            total:3,
            s:-1,
        },{
            name:'图2',
            src:'./images/i2.png',
            zts:[{l:0,t:0,w:10,h:10},{l:15,t:15,w:10,h:10}],
            total:2,
            s:-1
        },{
            name:'图3',
            src:'./images/i1.png',
            zts:[{l:0,t:0,w:10,h:10}],
            total:2,
            s:-1
        }],
    };
    window.ZT=new Game(options);
});
